$().ready(function()
{
	var spacing = 108 + 10 * 2;
	$('#featured-books').css(
	{
		'width': spacing * 3,
		'height': '186px',
		'overflow-x': 'hidden'
	}).find('.covers a').css(
	{
		'float': 'none',
		'position': 'absolute',
		'left': 1000
	});
	// var $covers = $('#featured-books .covers a');
	// $covers.eq(0).css('left', 0);
	// $covers.eq(1).css('left', spacing);
	// $covers.eq(2).css('left', spacing * 2);
	// 添加键头图标
	function createControl(src)
	{
		return $('<img/>').attr(
		{
			'src': src,
			'width': 64
		}).addClass('control')
			.css('opacity', 0.6).css('display', 'none');
	}
	var $leftRollover = createControl('left-arrow.png');
	var $rightRollover = createControl('right-arrow.png');
	var $enlargeRollover = createControl('enlarge.jpg');

	// 放大图像
	var $enlargeCover = $('<img/>').addClass('enlarged').hide().appendTo('body');
	
	// 等待指示器
	var $waitThrobber = $('<img/>').attr('src', 'ajax-loader.gif')
		.addClass('control').css('z-index', 4).hide();

	var setUpCovers = function()
	{
		var $covers = $('#featured-books .covers a');
		$covers.unbind('click mouseenter mouseleave');
		$covers.eq(0).css('left', 0).click(function(event)
		{
			// 添加滑移效果
			$covers.eq(0).animate({'left': spacing}, 'fast');
			$covers.eq(1).animate({'left': spacing * 2}, 'fast');
			$covers.eq(2).animate({'left': spacing * 3}, 'fast');

			$covers.eq($covers.length - 1).css('left', -spacing).animate({'left': 0}, 'fast', function()
			{
				$(this).prependTo('#featured-books .covers');
				setUpCovers();
			});
			event.preventDefault();
		}).hover(function()
		{
			$leftRollover.appendTo(this).show();
		}, function()
		{
			$leftRollover.hide();
		});
		$covers.eq(2).css('left', spacing * 2).hover(function()
		{
			$rightRollover.appendTo(this).show();
		},function()
		{
			$rightRollover.hide();
		}).click(function(event)
		{
			// 添加滑移效果
			$covers.eq(0).animate({'left': -spacing}, 'fast', function()
			{
				$(this).appendTo('#featured-books .covers');
				setUpCovers();
			});
			$covers.eq(1).animate({'left': 0}, 'fast');
			$covers.eq(2).animate({'left': spacing}, 'fast');
			$covers.eq(3).css('left', spacing * 3).animate({'left': spacing * 2}, 'fast');
			event.preventDefault();
		});
		$covers.eq(1).css('left', spacing).hover(function()
		{
			$enlargeRollover.appendTo(this).show();
		},function()
		{
			$enlargeRollover.hide();
		}).click(function(event)
		{
			$waitThrobber.appendTo(this).show();
			// 放大添加动画效果
			var startPos = $(this).offset();
			startPos.width = $(this).width();
			startPos.height = $(this).height();
			var endPos = {};
			endPos.width = startPos.width * 3;
			endPos.height = startPos.height * 3;
			endPos.top = 100;
			endPos.left = ($('body').width() - endPos.width) / 2;

			$enlargeCover.attr('src', $(this).attr('href')).css(startPos).show()
			var performAnimation = function()
			{
				$waitThrobber.hide();
				$enlargeCover.animate(endPos, 'normal', function()
				{
					$enlargeCover.one('click', function()
					{
						$enlargeCover.fadeOut();
					});
				});
				event.preventDefault();
			}
			if ($enlargeCover[0].complete)
			{
				performAnimation();
			}
			else
			{
				$enlargeCover.bind('load', performAnimation);
			}
			
		});
	};
	setUpCovers();

	// console.log(1);
});